<template>
  <navbar/>
  <div class="container main">
      <el-pagination
        v-model:currentPage="currentPage"
        :page-size="13"
        :disabled="disabled"
        :background="true"
        layout="total, prev, pager, next"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
      <pagination />
    <el-button @click="testputreport">获取文章</el-button>
  </div>
  <!-- 返回顶部组件 -->
  <el-backtop :right="50" :bottom="50" />
</template>
<script setup>
import navbar from '@/components/navbar.vue'
import { ref } from 'vue'
import { putreport,updateReport,removeComment, removeReport,selectByTag,
  select,putReportByLike,pushComment,likeReport,putOneReport,addcomment,
  uploadPost,login
} from '@/api/system.js'
const total = ref(0)
const currentPage = ref(1)
const disabled = ref(false)
const handleSizeChange = (val) => {
  console.log(`${val} items per page`)
  console.log(val)
}
const handleCurrentChange = (val) => {
  const data = {
    page:val,
  }
  //获取文章列表
  putreport(data).then((res) => {
    //配置分页器
    console.log(res)
    total.value=res.count
  })
  console.log(val)
}
//上传文章
const textuploadPost = () =>{
  const data = {
      title: '',
			tag: 'data.tag',
			user_id: 'data.user_id',
			img: '',
			report: '',
  }
  uploadPost(data).then((res) => {
    console.log(res)
  })
}
//登录
const textlogin = () =>{
  const data = {
    password:1,
    username:10
  }
  login(data).then((res) => {
    console.log(res)
  })
}
//更新文章
const textupdateReport = () =>{
  const data = {
    report_id:1,//必填
    title:1,//下面选填
    tag:1,
    img:1,
    report:10
  }
  updateReport(data).then((res) => {
    console.log(res)
  })
}
//获取文章列表
const testputreport = () =>{

  const data = {
    page:1,
  }
//获取文章列表
  putreport(data).then((res) => {
    //配置分页器
    console.log(res)
    total.value=res.count
  })
}
//添加评论
const testaddcomment = () =>{
  const data = {
    user_id:'',
    report_id:'',
    comment:''
  }
  addcomment(data).then((res) => {
    console.log(res)
  })
}
//获取文章详情
const testputOneReport = () =>{
  const data = {
    report_id:1,
  }
  putOneReport(data).then((res) => {
    console.log(res)
  })
}
//文章点赞
const textlikeReport = () =>{
  const data = {
    report_id:''

  }
  likeReport(data).then((res) => {
    console.log(res)
  })
}
//获取文章评论
const testpushComment = () =>{
  const data = {
    report_id:'',
    page:10
  }
  pushComment(data).then((res) => {
    console.log(res)
  })
}
//根据赞获取文章
const testputReportByLike = () =>{
  const data = {
    page:1,
  }
  putReportByLike(data).then((res) => {
    console.log(res)
  })
}
//搜索
const testselect = () =>{
  const data = {
    message:1,
    page:10
  }
  select(data).then((res) => {
    console.log(res)
  })
}
//通过标签搜索
const testselectByTag = () =>{
  const data = {
    tag:1,
    page:10
  }
  selectByTag(data).then((res) => {
    console.log(res)
  })
}
//删除文章
const testremoveReport = () =>{
  const data = {
    report_id:1,
  }
  removeReport(data).then((res) => {
    console.log(res)
  })
}
//删除评论
const testremoveComment = () =>{
  const data = {
    comment_id:1,

  }
  removeComment(data).then((res) => {
    console.log(res)
  })
}
</script>
<style lang="scss" scoped>
.main{
  margin-top: 90px;
  margin-bottom: 30px;
  width: 100%;
}
</style>